<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui">

<h:head>
	<link href="../css/styleButton.css" rel="stylesheet" type="text/css" />
	<style type="text/css">
body {
	width: 950px;
	background-image: url("../images/bg-logon.gif");
	margin: 0 auto;
	padding-top: 55px;
}

td {
	font-weight: bold;
}

input {
	width: 310px;
	height: 28px;
	font-weight: normal;
}

.error {
	color: red;
}

#formLogon {
	float: right;
	background-color: #E6E6E6;
	width: 380px;
}
</style>
</h:head>
<h:body>

	<h:link outcome="index.jsf">
		<img src="../images/photoshop_image.gif" alt="Loading........"
			style="width: 480px; margin-left: -20px;"></img>
	</h:link>

	<div id="formLogon">
		<fieldset style="width: 370px; border: none;">
			<legend style="font-weight: bold; font-size: 19px; padding-top: 8px;">Logon</legend>
			<h:form>
				<h:panelGrid id="panelGridLogon">

					<h:outputText value="User name "></h:outputText>
					<p:inputText id="uN" value="#{userBean.userName}" required="true"
						requiredMessage="Username is required" />
					<h:message styleClass="error" for="uN" />

					<h:outputText value="Password"></h:outputText>
					<p:password id="pS" value="#{userBean.password}" required="true"
						requiredMessage="Password is required" />
					<h:message styleClass="error" for="pS"></h:message>

					<h:inputHidden value="@@" id="wrongAccount"></h:inputHidden>
					<h:message for="wrongAccount"></h:message>

					<h:panelGroup>
						<h:commandButton action="#{userBean.logon}" value="Login"
							styleClass="styleButton"></h:commandButton>
						<h:button outcome="register.jsf" value="Create New Account"
							styleClass="styleButton"></h:button>
					</h:panelGroup>

					<h:link outcome="forgotPassword.jsf" style="text-decoration:none;"
						value="Forgot password?"></h:link>

				</h:panelGrid>

			</h:form>
		</fieldset>
	</div>



</h:body>
</html>